import React from 'react';
import { Table, Row, Col, Form, Input, Icon, InputNumber, Radio, DatePicker, Select, Upload, Button, Switch, Modal, Popconfirm, Tabs, message } from 'antd';
import BizParams from '../../components/commons/BizParams'
import CurrencySelect from '../../components/commons/CurrencySelect'

const R = require('ramda');
import moment from 'moment'
const TabPane = Tabs.TabPane;
const FormItem = Form.Item;
const dateFormat = 'YYYY-MM-DD';
const view = "view"
const Option = Select.Option;

export default Form.create({ wrappedComponentRef: true })(class Claim extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            open: false,
            disabled: true,
            cstId: "",
            loading: false
        }
    }

    handleCancel = () => {
        this.handleResetFields();
        this.setState({ loading: false });
    }

    handleResetFields = () => {
        this.props.form.resetFields();
        this.props.dispatch({
            type: "claim/setCustomer",
            payload: {
                data: {}
            }
        });
    }
    handleChange = (value) => {
        let form = this.props.form;
        let dataList=R.isNil(this.props.claim)?null:this.props.claim.customer.content;
        for (let i in dataList) {
            let item = dataList[i];
            if (item.companyname == value) {
                form.setFieldsValue({ "companytype": item.companytype });
                form.setFieldsValue({ "claimcstid": item.customerno });
                this.setState({
                    cstId: item.id
                });

            }
        }
    };
    handleConfirm = (re) => {
        if (this.props.type == view) {
            return;
        }

        let cst = R.isNil(this.props.claim.customer) ? {} : this.props.claim.customer;

        if (R.isNil(cst) || R.isEmpty(cst)) {
            message.info("请先查询客户");
            return;
        }


        this.props.form.validateFields((errors, values) => {
            if (errors) return;

            let type = "";
            let payload = {}

            if (values.claimamount <= 0) {
                message.error("认领金额需大于0！");
                return;
            }

            if (values.claimamount > this.props.dataSource.noclaimamount) {
                message.error("认领金额大于待认领金额！");
                return;
            }

            type = "claim/addClaimForex";
            payload = {
                forexid: this.props.dataSource.id,
                claimamount: values.claimamount,
                claimamountunit: this.props.dataSource.recamountunit,
                claimcstid: this.state.cstId,
                onSuccess: () => {
                    if(re && re.resetLoading)re.resetLoading(false);
                    this.props.handleCancel();
                    this.props.handleSearch();
                },
                onFail: () => {if(re && re.resetLoading)re.resetLoading(false)}
            };

            if(re && re.resetLoading)re.resetLoading(true);
            this.props.dispatch({
                type: type,
                payload: payload
            });
        })
    }


    getCustomet = () => {
        let nameOrCode = this.props.form.getFieldValue("nameOrCode");
        if (R.isNil(nameOrCode) || R.isEmpty(nameOrCode)) {
            message.info("请输入查询条件");
            return;
        }


        this.props.dispatch({
            type: "claim/getCustomerByNameOrCode",
            payload: {
                nameOrCode: nameOrCode,
                onEmpty: this.onEmpty.bind(this),
            }
        });
    }


    onEmpty = () => {
        this.props.form.setFieldsValue({ companytype: null, cstName: null, claimcstid: null });
    }

    render() {

        const { getFieldDecorator } = this.props.form;
        const formItemLayout = { labelCol: { xs: { span: 8 }, sm: { span: 8 } }, wrapperCol: { xs: { span: 15 }, sm: { span: 14 } } };
        let dataSource = R.isNil(this.props.dataSource) ? null : this.props.dataSource;
        let dataList=R.isNil(this.props.claim)?null:this.props.claim.customer.content;
         // console.log(dataSource);
        //   let data= this.state.data;



        let options = [];
        for (let i in dataList) {
            options.push(<Option value={dataList[i].companyname}>{dataList[i].companyname}（{dataList[i].customerno}）</Option>)
        }

        //
        // const options = R.isNil(data)?null:this.state.data.map(
        //     (item)=>{
        //         return <Option value={item.companyname}>{item.companyname}</Option>
        //     }
        // );
        return (
            <Form>
                <Tabs tabPosition={'top'}>
                    <TabPane tab="认领" key="1">
                        <Form>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout}
                                        label="客户查询"
                                        hasFeedback
                                    >
                                        <div>
                                            {getFieldDecorator('nameOrCode', {})(
                                                <Input placeholder="请输入客户编码或名称" disabled={this.props.type == "view" ? true : false}
                                                    style={{ width: '100%' }} />
                                            )}
                                        </div>
                                    </FormItem>
                                </Col>
                                <Col span={6}>
                                    <Button type="primary" icon="className" size={'default'}
                                        disabled={this.props.disabled}
                                        onClick={this.getCustomet.bind(this)}
                                        style={{ marginLeft: 135, marginBottom: 20 }}>查询</Button>
                                </Col>
                                <Col span={6}>
                                    <Button type="primary" icon="className" size={'default'}
                                        disabled={this.props.disabled}
                                        onClick={this.handleResetFields.bind(this)}
                                        style={{ marginLeft: -10, marginBottom: 20 }}>清空</Button>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout}
                                        label="客户名称"
                                        hasFeedback
                                    >
                                        <div>
                                            {getFieldDecorator('cstName', {
                                                rules: [{
                                                    required: true, message: '请输入客户名称',
                                                }],
                                                initialValue: dataSource.companyname
                                            })(
                                                <Select
                                                    onChange={this.handleChange.bind(this)}
                                                >
                                                    {options}
                                                </Select>
                                                )}
                                        </div>
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout}
                                        label="认领金额"
                                        hasFeedback
                                    >
                                        <div>
                                            {getFieldDecorator('claimamount', {
                                                rules: [{
                                                    required: true, message: '请输入认领金额',
                                                }],
                                                initialValue: ""

                                            })(
                                                <InputNumber style={{ width: '100%' }} min={0}
                                                    disabled={this.props.type == "view" ? true : false} maxLength="18"/>
                                                )}
                                        </div>
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout}
                                        label="客户代码"
                                        hasFeedback
                                    >
                                        <div>
                                            {getFieldDecorator('claimcstid', {
                                                rules: [{
                                                    required: true, message: '请输入客户代码',
                                                }],
                                                 // initialValue: dataSource.id
                                            })(
                                                <Input disabled={true} />
                                                )}
                                        </div>
                                    </FormItem>
                                </Col>
                                <Col span={12}>
                                    <FormItem
                                        {...formItemLayout}
                                        label="客户类型"
                                        hasFeedback
                                    >
                                        <div>
                                            {getFieldDecorator('companytype', {
                                                initialValue: dataSource.companytype

                                            })(
                                                <BizParams sprCode={"cstType"} style={{ width: '100%' }} blank={true} disabled={true} />
                                                )}
                                        </div>
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                    </TabPane>
                </Tabs>
            </Form>

        );
    }
})


